<template>
    <div class="chart" ref="chart"></div>
  </template>
  
  <script>
  import * as echarts from "echarts";
  export default {
    mounted() {
      this.char = null;
      this.initChart();
    },
    destroyed() {
      this.chart && this.chart.dispose();
    },
    methods: {
      initChart() {
        if (!this.$refs.chart) {
          return;
        }
        const option = {
  xAxis: {
    type: 'category',
    data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
  },
  yAxis: {
    type: 'value'
  },
  series: [
    {
      data: [820, 932, 901, 934, 1290, 1330, 1320],
      type: 'line',
      smooth: true
    }
  ]
};
        this.$refs.chart.style.height = "280px";
        this.$refs.chart.style.width = getComputedStyle(
          this.$refs.chart.parentNode
        ).width;
        this.chart = echarts.init(this.$refs.chart);
        this.chart.setOption(option);
      },
    },
  };
  </script>
  <style>
  .mod-home {
    line-height: 1.5;
  }
  </style>
  